import L, { LatLng, Point } from 'leaflet';
import Feature from '../feature/feature';
import Line from '../feature/line';
import { FeatureInstance, FeatureJson, LayerOption } from '../types';
import Layer from './layer';
import { generateId } from '../util/util';
import { getAnotation } from '../util/util';

class LinesLayer extends Layer {
    /**
     * 记录正在绘制的线的id，
     * 不能保存对象，因为当前绘制的要素可能会因为撤销/重做操作而被重新生成，与保存的对象地址不一致
     */
    private drawingId?: string;

    constructor(layerOption: LayerOption) {
        super(layerOption, 'line');
        this.layerOption.drawEnd = this.drawEnd.bind(this);
        this.layerOption.featureClick = this.featureClick.bind(this);
        this.layerOption.featureMousemove = this.featureMousemove.bind(this);
        this.layerOption.featureMouseout = this.featureMouseout.bind(this);
        this.layerOption.featureMouseup = this.featureMouseup.bind(this);
        this.layerOption.addVertex = this.layerOption.nodesLayer!.addVertex.bind(this.layerOption.nodesLayer);
        this.layerOption.getCrossPoint = this.getCrossPoint.bind(this);
    }

    /**
     * 点击地图后开始绘制线
     * @param latLng 新标的线上的顶点坐标
     */
    draw(latLng: LatLng) {
        // 绘制线
        let line = this.drawingId ? <Line>this.features.get(this.drawingId) : undefined;
        if (!line) {
            const id = generateId('line');
            this.drawingId = id;
            line = new Line(id, this.layerOption, [[latLng]]);
            this.add(line);
            line.drawStart();
            this.layerOption.mode.setDrawFeature(line);
        } else {
            line.addLatLng(latLng);
            this.layerOption.mode.setDrawFeature(line);
            this.layerOption.addHistory({ annotation: getAnotation('draw ', line), features: [line] });
        }
    }

    /**
     * 画线时，不停替换坐标数组中最后一个经纬度，然后重绘
     * @param latLng
     * @returns
     */
    drawMove(latLng: LatLng) {
        if (!this.drawingId) {
            return;
        }
        const line = <Line>this.features.get(this.drawingId);
        if (line) {
            line.drawMove(latLng);
        }
    }

    drawEnd(feature: Feature) {
        this.drawingId = undefined;
        this.layerOption.changeMode('select', feature);
        this.layerOption.mode.setDrawFeature(null);
        this.layerOption.eventBus.emit('drawend', feature.instance());
    }

    render(features: FeatureJson[]): Feature[] {
        const results: Feature[] = [];
        features.forEach((feature) => {
            const { id, latLngs, properties } = feature;
            if (!latLngs || latLngs.length < 2 || this.features.get(id)) {
                return;
            }
            const line = new Line(id, this.layerOption, [latLngs as LatLng[]], properties);
            this.add(line);
            results.push(line);
            this.renderVertexs(line);
            if (this.layerOption.mode.drawFeature?.id === id) {
                line.ajustDashLine();
            }
        });
        return results;
    }

    renderVertexs(line: Line) {
        line.latLngs[0].forEach((latLng, index) => {
            // 除了两端点，其他隐藏，添加顶点时判断是否是交叉点，如果是，则去除_hidden
            const show = index === 0 || index === line.latLngs[0].length - 1 ? true : false;
            const judgeRepeat = true;
            const vertexId = this.layerOption.nodesLayer!.addVertex(
                latLng,
                [line],
                { className: 'vertex' },
                judgeRepeat,
                show
            );
            if (vertexId) {
                line.relateNodeIds[0].push(vertexId);
            }
        });
    }
}

export default LinesLayer;
